<template>
	<view class="my">
		<!-- <custom id='head' :style="{height:cusHeight+'px'}" textContent='我的'></custom> -->
		<view class="head" :style="{paddingTop:marginTop+'px'}">
			<image src="https://img0.baidu.com/it/u=4143210851,2046129875&fm=253&fmt=auto&app=138&f=JPEG?w=501&h=500">
			</image>
			<view>
				<!-- <view class="isLogin">未登录</view> -->
				<!-- <view class="admin">账号：15456498</view> -->
				<view class="admin">元沣智瞳验票助手</view>
			</view>
		</view>

		<view class="itemBox">
			<view class="item" @click="toSetData">
				<image src="../../static/img/set.png"></image>
				<view class="title">设置</view>
			</view>
			<view class="item" @click="toTest">
				<image src="../../static/img/set.png"></image>
				<view class="title">测试</view>
			</view>
			<view class="item" @click="tocao">
				<image src="../../static/img/set.png"></image>
				<view class="title">测试9</view>
			</view>
		</view>

		<!-- <view class="outLogin" @click="outLogin">退出登录</view> -->

		<!-- <view :style="{height:heightc+'px'}">
			<scroll-view style="height: 100%;" class="main-container" scroll-y>
				<view @click="toLoginPage">登录</view>
			</scroll-view>
		</view> -->
	</view>
</template>

<script>
	import {
		getImage,
		getName,
		systemInfo
	} from '@/utils/index.js';
	import custom from '../../colorui/commonpent/custom.vue'

	export default {
		data() {
			return {
				title: 'Hello',
				data: 0,
				heightc: 0,
				marginTop:60,
			}
		},
		components: {
			custom
		},
		onReady() {
			var that = this;
			
		},
		computed: {
			cusHeight() {
				let height = this.CustomBar / (uni.upx2px(this.CustomBar) / this.CustomBar) + 220;
				return this.CustomBar;
			}
		},

		async onLoad() {
			let that = this;
			uni.getSystemInfo({
				success: function(res) {
					that.marginTop = res.statusBarHeight + 26;
				
					// let view = uni.createSelectorQuery().select("#head"); //局部滑块
					// view.boundingClientRect(data => {
					// 	that.heightc = res.windowHeight - data.height;
					// }).exec();
				},
			});
		},
		methods: {
			tocao(){
				uni.navigateTo({
					url:'/pages/cao/cao'
				})
			},
			toTest(){
				uni.navigateTo({
					url:'/pages/test/test'
				})
			},
			outLogin(){
				uni.showModal({
				    title: '提示',
				    content: '确定要退出吗？',
				    success: function (res) {
				        if (res.confirm) {
				            console.log('用户点击确定');
				        } else if (res.cancel) {
				            console.log('用户点击取消');
				        }
				    }
				});
				
			},
			toSetData(){
				uni.navigateTo({
					url: '/pages/setData/setData'
				})
			},
			toLoginPage() {
				uni.navigateTo({
					url: '/pages/login/login'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.my {
		background-color: #F9F8FA;
		font-family: Source Han Sans CN-Medium, Source Han Sans CN;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: -1;
		height: 100%;
		.outLogin{
			    position: fixed;
			    bottom: 30px;
			    left: 50%;
			    width: 100px;
			    margin-left: -56px;
				text-align: center;
				background-color: #0065D8;
				color: #fff;
				border-radius: 30px;
				padding: 8px;
		}
		.itemBox{
			margin: 6px 0;
			.item{
				padding: 8px 16px;
				display: flex;
				background-color: #fff;
				align-items: center;
				image{
					width: 36px;
					height: 36px;
					margin-right: 14px;
				}
				.title{
					font-size: 14px;
					color: #636364;
				}
			}
		}
		.head {
			display: flex;
			padding: 26px;
			align-items: center;
			background-color: #fff;
			image {
				width: 80px;
				height: 80px;
				border-radius: 50%;
				margin-right: 26px;
			}

			.isLogin {
				font-size: 20px;
				margin-bottom: 10px;
				font-weight: 600;
			}
			.admin{
				color:#747475;
			}
		}

	}
</style>